<!-- 车辆维修保养申请 -->
<template>
	<view class="page">
		<u--form labelPosition="top" :model="model" ref="form" :rules="rules" labelWidth="auto" :labelStyle="{
				fontSize: '14px',
				color: '#B2B2B2',
				lineHight: '20px'
			}">
			<view class="basic-style">
				<view class="basic-title basic-border">基本信息</view>
				<u-form-item label="单据编号" prop="documentNo" :borderBottom="false" required>
					<u--input disabled placeholder="请输入单据编号" v-model="model.documentNo"></u--input>
				</u-form-item>
				<u-form-item label="申请时间" prop="createTime" :borderBottom="false" required>
					<u--input v-model="model.createTime" disabled placeholder="请选择申请时间" border="surround"
						suffixIcon="calendar-fill" :suffixIconStyle="{color: '#B2B2B2'}"></u--input>
				</u-form-item>
				<u-form-item label="申请人" prop="handlerId" :borderBottom="false" required>
					<h-select-person-input style="width: 100%" disabled v-model="model.handlerId" placeholder="请选择申请人"
						border="surround" suffixIcon="arrow-down-fill" :suffixIconStyle="{color: '#B2B2B2'}"
						objectField="model.handlerId"></h-select-person-input>
				</u-form-item>
				<u-form-item label="申请部门" prop="applyDept" :borderBottom="false" required>
					<h-select-depart-input disabled v-model="model.applyDept" :departName="model.applyDeptText"
						placeholder="请选择申请部门" border="surround" style="width: 100%" suffixIcon="arrow-down-fill"
						:suffixIconStyle="{ color: '#B2B2B2' }"
						:title.sync="model.applyDeptText"></h-select-depart-input>
				</u-form-item>
				
				
				<u-form-item label="经营团队" prop="managementTeam" required>
					<h-select-team-input style="width: 100%" v-model="model.managementTeam"
						objectField="model.managementTeam" placeholder="请选择经营团队" border="surround" :tdlx="3"
						suffixIcon="arrow-down-fill" :suffixIconStyle="{color: '#B2B2B2'}"></h-select-team-input>
				</u-form-item>
				<u-form-item label="车牌号" prop="carId" :borderBottom="false" ref="item1" required>
					<view style="width:100%" @click="fileTypeShow = true">
						<u--input placeholder="请选择车牌号" suffixIcon="arrow-down-fill"
							:suffixIconStyle="{color: '#B2B2B2'}" v-model="model.carNum" disabled
							disabledColor="#fff"></u--input>
						<u--input v-model="model.carId" v-show="false"></u--input>
					</view>
					<u-picker :columns="options" @confirm="carIdConfirm" :show="fileTypeShow"
						@cancel="fileTypeShow = false" keyName="car_num"></u-picker>
				</u-form-item>
				<u-form-item label="修报类型" prop="repairReportType" :borderBottom="false" ref="item1" required>
					<h-dict-select style="width: 100%" v-model="model.repairReportType" placeholder="请选择修报类型"
						dictName="repaire_status" suffixIcon="arrow-down-fill"
						:suffixIconStyle="{color: '#B2B2B2'}"></h-dict-select>
				</u-form-item>
				<u-form-item label="维修厂" prop="repairShop" required>
					<u--input v-model="model.repairShop" placeholder="请输入维修厂"></u--input>
				</u-form-item>
				<u-form-item label="当前里程数" prop="carKilometers" :borderBottom="false" ref="item1">
					<h-money-input placeholder="请输入当前里程数(km)" v-model="model.carKilometers"></h-money-input>
				</u-form-item>
				<u-form-item label="保险到期时间" prop="insuranceEndTime" :borderBottom="false">
					<h-time-select v-model="model.insuranceEndTime" placeholder="请选择保险到期时间"></h-time-select>
				</u-form-item>
				<u-form-item label="维修情况说明" prop="faultCause" :borderBottom="false" ref="item1" required>
					<u--textarea v-model="model.faultCause" confirmType="done" placeholder="请输入维修情况说明"
						:maxlength="500"></u--textarea>
				</u-form-item>
				<u-form-item label="备注" prop="remark" :borderBottom="false" ref="item1">
					<u--textarea v-model="model.remark" confirmType="done" placeholder="请输入备注"
						:maxlength="500"></u--textarea>
				</u-form-item>
			</view>
			<view class="basic-style">
				<view class="basic-title-center">
					<u-line :length="105"></u-line>
					<view class="">维修明细</view>
					<u-line :length="105"></u-line>
				</view>
				<CarMaintenanceInfoForm ref="carMaintenanceInfoFormRef" :dataList="model.erpCarMaintenanceDetailsList">
				</CarMaintenanceInfoForm>
			</view>
			<view class="basic-style">
				<view class="basic-title basic-border">附件信息</view>
				<view class="py-1 space-y-1" style="width: 100%">
					<view style="color: red">提示：请等待附件上传完成，再点击保存，否则附件无法保存成功！</view>
					<h-upload-file v-model="model.fileInfo" :isIcon="false" />
					<file-list v-if="model.fileInfo" v-model="model.fileInfo" :isDelete="true"></file-list>
				</view>
			</view>
			<view class="space-x-1 px-1 btn_position">
				<u-button :disabled="isSubmit" type="primary" :plain="true" text="保存" @click="onDraft"></u-button>
				<u-button :disabled="isSubmit"  type="primary"  text="保存并提交" @click="onSubmit"></u-button>
			</view>
			<view style="height: 100rpx;"></view>
		</u--form>
		<u-toast ref="uToast"></u-toast>
		<ProcessNodeConfiguration ref="processConfig" @ok="onOk"></ProcessNodeConfiguration>
	</view>
</template>

<script>
	import fileList from '@/pages/synergy/components/fileList.vue'
	import moment from 'moment'
	import CarMaintenanceInfoForm from './components/carMaintenanceInfoForm.vue'
	import ProcessNodeConfiguration from '@/components/ProcessNodeConfiguration/ProcessNodeConfiguration.vue' // 流程节点配置人员选择弹窗
	import {
		generatedFormNumber, // 获取单据编号
		queryCarNumList, //获取车辆列表
		addCarMaintenance, // 新增车辆维修保养申请
		queryByIdCarMaintenance, // 查询车辆维修保养申请
		editCarMaintenance,
		getChildrenListCarMaintenance // 查询车辆维修保养申请 -- 子表信息
	} from '@/api/index.js'
	export default {
		components: {
			fileList,
			CarMaintenanceInfoForm,
			ProcessNodeConfiguration
		},
		data() {
			return {
				id: '',
				fileTypeShow: false,
				model: {
					handlerId: '', // 申请人id
					createTime: '', // 申请时间
					documentNo: '', //单据编号
					applyDept: '', // 申请部门id
					applyDeptText: '', //申请部门
					managementTeam: '', //经营团队
					carId: '', //车牌号ID
					carNum: '', //车牌号
					repairReportType: '', //修报类型
					repairShop: '', //维修厂
					carKilometers: '', //当前里程数
					insuranceEndTime: '', //保险到期日期
					faultCause: '', //维修情况说明
					remark: '', //备注
					fileInfo: null, //附件
					erpCarMaintenanceDetailsList: [], //维修明细
				},
				rules: {
					documentNo: [{ required: true, message: '请输入单据编号!', trigger: ['blur', 'change'] }],
					handlerId: [{ required: true, message: '请选择申请人!', trigger: ['blur', 'change'] }],
					applyDept: [{ required: true, message: '请选择申请部门!', trigger: 'change' }],
					createTime: [{ required: true, message: '请选择申请时间!', trigger: ['blur', 'change'] }],
					managementTeam: [{
						required: true,
						message: '请选择经营团队!',
						trigger: 'change'
					}],
					carId: [{
						required: true,
						message: '请选择车牌号!',
						trigger: 'change'
					}],
					repairReportType: [{
						required: true,
						message: '请选择修报类型!',
						trigger: 'change'
					}],
					repairShop: [{
						required: true,
						message: '请输入维修厂!',
						trigger: 'change'
					}],
					faultCause: [{
						required: true,
						message: '输入维修情况说明!',
						trigger: 'change'
					}],
				},
				loading: false,
				options: [], //车牌号枚举
				isSubmit: false,
				//代码生成后需手动设置流程编码
				flowCode: 'dev_erp_car_maintenance_001',
				formUrl: "oa/carmaintenance/modules/ErpCarMaintenanceForm",
				formUrlMobile: '/pages/synergy/erpCarMaintenanceList',
				processId: '1536646854849159170',
				beanName: 'carMaintenanceFlow'
			}
		},
		onLoad(options) {
			this.initDictData()
			if (options.id) {
				this.id = options.id
				this.edit(options.id)
			} else {
				// 添加
				this.add()
			}
		},
		methods: {
			initDictData() {
				queryCarNumList().then(res => {
					if (res.success) {
						this.options.push(res.result)
					}
				})
			},
			// 添加
			add() {
				this.getGeneratedFormNumber()
				this.model.createTime = moment().format('YYYY-MM-DD HH:mm:ss'); // 申请时间
				this.model.handlerId = uni.getStorageSync('userInfo').empId; //申请人id
				this.model.applyDept = uni.getStorageSync('userInfo').deptId; //申请部门id
			},
			async edit(id){
				const response = await queryByIdCarMaintenance({ id })
				const data = response?.result || {}
				this.model = await Object.assign({}, data)
				var item =  this.options[0].find((value, keys, arr) => {
					return value.id == this.model.carId
				})
				this.model.carNum = item.car_num
				const res = await getChildrenListCarMaintenance({
					maintenanceId: this.model.id,
					pageNo: 1,
					pageSize: 100,
					column: 'createTime',
					order: 'desc'
				})
				this.$set(this.model,'erpCarMaintenanceDetailsList',res.result.records)
			},
			// 获取单据编号
			getGeneratedFormNumber() {
				generatedFormNumber({
					prefix: 'CLWX',
					subSystemCode: '04'
				}).then(res => {
					if (res.success) {
						this.$set(this.model, 'documentNo', res.result)
						this.$set(this.model, 'bpmBizTitle', uni.getStorageSync('userInfo')?.employee?.name + '-' + res.result)
					}
				})
			},
			// 选择车牌号
			carIdConfirm(val) {
				const {
					value
				} = val
				this.model.carId = value[0].id
				this.model.carNum = value[0].car_num
				this.fileTypeShow = false
			},
			// 保存提交
			async onSubmit() {
				const val = await this.$refs.form.validate()
				if (!val) return
				this.model.erpCarMaintenanceDetailsList = this.$refs.carMaintenanceInfoFormRef.getData()
				if (!this.model.erpCarMaintenanceDetailsList.length) {
					this.$refs.uToast.show({
						type: 'error',
						message: "请添加维修明细",
						icon: 'none'
					})
					return
				}
				this.isSubmit = true
				try {
				  this.loading = true
					var url = ''
					if (this.id) {
						url = editCarMaintenance
					} else {
						url = addCarMaintenance
					}
				  const response = await url({
				    ...this.model,
				  })
				  this.$u.toast(response.message)
				  if (response.success) {
				    var that = this
				    
				    // 获取流程列表
				    if (this.model.id) {
				    	this.getProcessList(this.model.id)
				    } else {
				    // 判断添加的时候是否有返回id值
				    	if (response.result) {
				    		this.getProcessList(response.result)
				    	}
				    
				    }
				    this.$refs.uToast.show({
				    	message: response.message,
				    	type: 'default',
				    	complete () {
				    		// that.isSubmit = false
				    	}
				    })
				  }
				} finally {
				  this.loading = false
				}
			},
			// 获取流程列表
			getProcessList (id) {
				if (this.isSubmit) {
					this.$refs.processConfig.showPopup = true
					this.$refs.processConfig.formUrl = this.formUrl
					this.$refs.processConfig.formUrlMobile = this.formUrlMobile
					this.$refs.processConfig.flowCode = this.flowCode
					this.$refs.processConfig.edit(id, this.processId, this.beanName)
				}
			},
			// 提交流程成功
			onOk () {
				this.$refs.uToast.show({
					message: '提交成功',
					type: 'success',
					complete () {
						if (getCurrentPages().length > 1) {
							uni.navigateBack()
						} else {
							uni.reLaunch({
								url: '/pages/home/home'
							})
						}
						
					}
				})
			},
			// 保存
			async onDraft() {
				// const val = await this.$refs.form.validate()
				// if (!val) return
				this.model.erpCarMaintenanceDetailsList = this.$refs.carMaintenanceInfoFormRef.getData()
				// if (!this.model.erpCarMaintenanceDetailsList.length) {
				// 	this.$refs.uToast.show({
				// 		type: 'error',
				// 		message: "请添加维修明细",
				// 		icon: 'none'
				// 	})
				// 	return
				// }
				this.isSubmit = true
				try {
				  this.loading = true
					var url = ''
					if (this.id) {
						url = editCarMaintenance
					} else {
						url = addCarMaintenance
					}
				  const response = await url(this.model)
				  if (response.success) {
						this.$refs.uToast.show({
							message: response.message,
							type: 'default',
							complete () {
								this.isSubmit = false
								if (getCurrentPages().length > 1) {
									uni.navigateBack()
								} else {
									uni.reLaunch({
										url: '/pages/home/home'
									})
								}
							}
						})
				  } else {
						this.$refs.uToast.show({
							message: response.message,
			  			type: 'error'
						})
					}
				} finally {
				  this.loading = false
					this.isSubmit = false
				}
			}
		}
	}
</script>


<style lang="scss" scoped>
	@import url("@/assets/inputStyle.scss");
</style>